
<template>
    <div class="clickitem"  @click="handleClick">
        <div class="icon"><slot name="icon"></slot></div>
        <div class="text"><slot name="text"></slot></div>
        <div class="phone text" v-show="isShow"><slot name="phone"></slot></div>
        <div class="jiantou"><slot name="jiantou"></slot></div>
        <div  class="ipt"> <slot name="ipt"></slot></div>
    </div>
</template>

<script>
    export default {
        props: {
            isShow: {
                type: Boolean,
                default: true
            },
        },
        methods: {
            handleClick() {
                this.$emit("handleClick")
            }
        },
    }
</script>

<style  scoped>
.clickitem{
    color: #12163b;
    display: flex;
    width: 350px;
    height: 50px;
    margin-left:25px;
    line-height: 50px;
    font-size: 15px;
    position: relative;
    border-bottom: 1px solid #f0eff4;
    position: relative;

}
.text{
    
    margin-top: 2px;
}
.phone{
    width: 96px;
    height: 48px;
    margin-left: 135px;
    margin-right: 10px;
    color: #ccc;
}
img{
    vertical-align: middle;
}
.icon img{
    width: 16px;
    height: 16px;
    margin-right:12px;
}
.jiantou img{
    width: 9px;
    height: 15px;
}

</style>